<!DOCTYPE html>
<html>
  <head>
    <title>HostsSwitch</title>
    <meta charset="utf-8" />
    <meta name="author" content="LnnCoCo" />
    <meta name="description" content="" />
    <meta name="google" content="notranslate" />
    <link rel="shortcut icon" type="image/ico" href="/asset/favicon.png" />
  </head>
  <body>
    <div class="container">
      <nav>
        <div class="nav-container" id="nav"><ul></ul></div>
      </nav>
      <main>
        <div class="textarea">
          <div class="operation">
            <div class="save"></div>
            <div class="net"></div>
            <div class="refresh"></div>
          </div>
          <textarea class="ui-textarea" id="textarea"></textarea>
        </div>
      </main>
    </div>
    <div class="context-menu"></div>
    <div class="shade"></div>
    <div class="dialog-item">
      <div class="item-hader">修改配置</div>
      <div class="item-body">
        <div class="form-item">标签名称： <input class="ui-input" name="name" /></div>
        <div class="form-item">远程地址： <input class="ui-input" name="url" placeholder="无需远程获取则留空" /></div>
      </div>
      <div class="item-operation clearfix">
        <button class="ui-button" data-type="primary" id="dialog_apply">确定</button>
        <button class="ui-button" id="dialog_cancel">取消</button>
      </div>
    </div>
    <script charset="utf-8" src="/js/main.ts"></script>
    <!-- 导航栏模板 -->
    <script id="template_nav" type="text/html">
      {{each $data item}}
      <li data-id="{{item.id}}" class="nav-item {{item.active ? 'active' : ''}} {{ item.home? 'home' : '' }} {{ item.url? 'net' : '' }}">
        {{item.name}}
        <div class="onoff"><input type="checkbox" id="onoff{{$index}}" {{item.checked && "checked"}} {{item.home && 'disabled'}} /><label class="ui-switch" for="onoff{{$index}}"></label></div>
      </li>
      {{/each}}
    </script>
    <!-- 右键菜单模板 -->
    <script id="template_contextMenu" type="text/html">
      <div>
        {{if $data.target}}
        <div class="menu-target">{{target}}</div>
        {{/if}}
        <ul>
          {{each list item}} {{if item.line}}
          <li class="menu-line"></li>
          {{else}}
          <li class="menu-item {{ ((item.action === 'update' && isLocal) || ((item.action === 'remove' || item.action === 'unlock' || item.action === 'modify') && isHome))? 'disabled' : ''}}" data-action="{{item.action}}">
            {{if item.icon}}
            <div class="icon"><img src="{{item.icon}}" alt="" /></div>
            {{/if}} {{item.text}}
          </li>
          {{/if}} {{/each}}
        </ul>
      </div>
    </script>
  </body>
</html>
